﻿
var xvFormCreator = function () {

    //pass the template name and the data source of the template
    return {
        restrict: 'EA',
        scope: {
            sourceData: '='         
        },
        controller: function ($scope, $http)
       {
           // spliting values & options for controls with this feature
            if ($scope.sourceData.Option != null) {
                $scope.sourceData.Option = $scope.sourceData.Option.split(',');
            }
            if ($scope.sourceData.Value != null) {
                $scope.sourceData.Value = $scope.sourceData.Value.split(',');
            }
           
           $scope.getLocation = function (val) {
                return $http.get('http://maps.googleapis.com/maps/api/geocode/json', {
                    params: {
                        address: val,
                        sensor: false
                    }
                }).then(function (response) {
                    return response.data.results.map(function (item) {
                        return item.formatted_address;
                    });
                });
            };
           $scope.statesWithFlags = [{ 'name': 'Alabama', 'flag': '5/5c/Flag_of_Alabama.svg/45px-Flag_of_Alabama.svg.png' }, { 'name': 'Alaska', 'flag': 'e/e6/Flag_of_Alaska.svg/43px-Flag_of_Alaska.svg.png' }, { 'name': 'Arizona', 'flag': '9/9d/Flag_of_Arizona.svg/45px-Flag_of_Arizona.svg.png' }, { 'name': 'Arkansas', 'flag': '9/9d/Flag_of_Arkansas.svg/45px-Flag_of_Arkansas.svg.png' }, { 'name': 'California', 'flag': '0/01/Flag_of_California.svg/45px-Flag_of_California.svg.png' }, { 'name': 'Colorado', 'flag': '4/46/Flag_of_Colorado.svg/45px-Flag_of_Colorado.svg.png' }, { 'name': 'Connecticut', 'flag': '9/96/Flag_of_Connecticut.svg/39px-Flag_of_Connecticut.svg.png' }, { 'name': 'Delaware', 'flag': 'c/c6/Flag_of_Delaware.svg/45px-Flag_of_Delaware.svg.png' }, { 'name': 'Florida', 'flag': 'f/f7/Flag_of_Florida.svg/45px-Flag_of_Florida.svg.png' }, { 'name': 'Georgia', 'flag': '5/54/Flag_of_Georgia_%28U.S._state%29.svg/46px-Flag_of_Georgia_%28U.S._state%29.svg.png' }, { 'name': 'Hawaii', 'flag': 'e/ef/Flag_of_Hawaii.svg/46px-Flag_of_Hawaii.svg.png' }, { 'name': 'Idaho', 'flag': 'a/a4/Flag_of_Idaho.svg/38px-Flag_of_Idaho.svg.png' }, { 'name': 'Illinois', 'flag': '0/01/Flag_of_Illinois.svg/46px-Flag_of_Illinois.svg.png' }, { 'name': 'Indiana', 'flag': 'a/ac/Flag_of_Indiana.svg/45px-Flag_of_Indiana.svg.png' }, { 'name': 'Iowa', 'flag': 'a/aa/Flag_of_Iowa.svg/44px-Flag_of_Iowa.svg.png' }, { 'name': 'Kansas', 'flag': 'd/da/Flag_of_Kansas.svg/46px-Flag_of_Kansas.svg.png' }, { 'name': 'Kentucky', 'flag': '8/8d/Flag_of_Kentucky.svg/46px-Flag_of_Kentucky.svg.png' }, { 'name': 'Louisiana', 'flag': 'e/e0/Flag_of_Louisiana.svg/46px-Flag_of_Louisiana.svg.png' }, { 'name': 'Maine', 'flag': '3/35/Flag_of_Maine.svg/45px-Flag_of_Maine.svg.png' }, { 'name': 'Maryland', 'flag': 'a/a0/Flag_of_Maryland.svg/45px-Flag_of_Maryland.svg.png' }, { 'name': 'Massachusetts', 'flag': 'f/f2/Flag_of_Massachusetts.svg/46px-Flag_of_Massachusetts.svg.png' }, { 'name': 'Michigan', 'flag': 'b/b5/Flag_of_Michigan.svg/45px-Flag_of_Michigan.svg.png' }, { 'name': 'Minnesota', 'flag': 'b/b9/Flag_of_Minnesota.svg/46px-Flag_of_Minnesota.svg.png' }, { 'name': 'Mississippi', 'flag': '4/42/Flag_of_Mississippi.svg/45px-Flag_of_Mississippi.svg.png' }, { 'name': 'Missouri', 'flag': '5/5a/Flag_of_Missouri.svg/46px-Flag_of_Missouri.svg.png' }, { 'name': 'Montana', 'flag': 'c/cb/Flag_of_Montana.svg/45px-Flag_of_Montana.svg.png' }, { 'name': 'Nebraska', 'flag': '4/4d/Flag_of_Nebraska.svg/46px-Flag_of_Nebraska.svg.png' }, { 'name': 'Nevada', 'flag': 'f/f1/Flag_of_Nevada.svg/45px-Flag_of_Nevada.svg.png' }, { 'name': 'New Hampshire', 'flag': '2/28/Flag_of_New_Hampshire.svg/45px-Flag_of_New_Hampshire.svg.png' }, { 'name': 'New Jersey', 'flag': '9/92/Flag_of_New_Jersey.svg/45px-Flag_of_New_Jersey.svg.png' }, { 'name': 'New Mexico', 'flag': 'c/c3/Flag_of_New_Mexico.svg/45px-Flag_of_New_Mexico.svg.png' }, { 'name': 'New York', 'flag': '1/1a/Flag_of_New_York.svg/46px-Flag_of_New_York.svg.png' }, { 'name': 'North Carolina', 'flag': 'b/bb/Flag_of_North_Carolina.svg/45px-Flag_of_North_Carolina.svg.png' }, { 'name': 'North Dakota', 'flag': 'e/ee/Flag_of_North_Dakota.svg/38px-Flag_of_North_Dakota.svg.png' }, { 'name': 'Ohio', 'flag': '4/4c/Flag_of_Ohio.svg/46px-Flag_of_Ohio.svg.png' }, { 'name': 'Oklahoma', 'flag': '6/6e/Flag_of_Oklahoma.svg/45px-Flag_of_Oklahoma.svg.png' }, { 'name': 'Oregon', 'flag': 'b/b9/Flag_of_Oregon.svg/46px-Flag_of_Oregon.svg.png' }, { 'name': 'Pennsylvania', 'flag': 'f/f7/Flag_of_Pennsylvania.svg/45px-Flag_of_Pennsylvania.svg.png' }, { 'name': 'Rhode Island', 'flag': 'f/f3/Flag_of_Rhode_Island.svg/32px-Flag_of_Rhode_Island.svg.png' }, { 'name': 'South Carolina', 'flag': '6/69/Flag_of_South_Carolina.svg/45px-Flag_of_South_Carolina.svg.png' }, { 'name': 'South Dakota', 'flag': '1/1a/Flag_of_South_Dakota.svg/46px-Flag_of_South_Dakota.svg.png' }, { 'name': 'Tennessee', 'flag': '9/9e/Flag_of_Tennessee.svg/46px-Flag_of_Tennessee.svg.png' }, { 'name': 'Texas', 'flag': 'f/f7/Flag_of_Texas.svg/45px-Flag_of_Texas.svg.png' }, { 'name': 'Utah', 'flag': 'f/f6/Flag_of_Utah.svg/45px-Flag_of_Utah.svg.png' }, { 'name': 'Vermont', 'flag': '4/49/Flag_of_Vermont.svg/46px-Flag_of_Vermont.svg.png' }, { 'name': 'Virginia', 'flag': '4/47/Flag_of_Virginia.svg/44px-Flag_of_Virginia.svg.png' }, { 'name': 'Washington', 'flag': '5/54/Flag_of_Washington.svg/46px-Flag_of_Washington.svg.png' }, { 'name': 'West Virginia', 'flag': '2/22/Flag_of_West_Virginia.svg/46px-Flag_of_West_Virginia.svg.png' }, { 'name': 'Wisconsin', 'flag': '2/22/Flag_of_Wisconsin.svg/45px-Flag_of_Wisconsin.svg.png' }, { 'name': 'Wyoming', 'flag': 'b/bc/Flag_of_Wyoming.svg/43px-Flag_of_Wyoming.svg.png' }];
           $scope.contries = [' Andorra ', ' United Arab Emirates ', ' Afghanistan ', ' Antigua and Barbuda ', ' Anguilla ', ' Albania ', ' Armenia ', ' Netherlands Antilles ', ' Angola ', ' Antarctica ', ' Argentina ', ' American Samoa ', ' Austria ', ' Australia ', ' Aruba ', ' Åland Islands ', ' Azerbaijan ', ' Bosnia and Herzegovina ', ' Barbados ', ' Bangladesh ', ' Belgium ', ' Burkina Faso ', ' Bulgaria ', ' Bahrain ', ' Burundi ', ' Benin ', ' Saint Barthélemy ', ' Bermuda ', ' Brunei ', ' Bolivia ', ' British Antarctic Territory ', ' Brazil ', ' Bahamas ', ' Bhutan ', ' Bouvet Island ', ' Botswana ', ' Belarus ', ' Belize ', ' Canada ', ' Cocos [Keeling] Islands ', ' Congo - Kinshasa ', ' Central African Republic ', ' Congo - Brazzaville ', ' Switzerland ', ' Côte d’Ivoire ', ' Cook Islands ', ' Chile ', ' Cameroon ', ' China ', ' Colombia ', ' Costa Rica ', ' Serbia and Montenegro ', ' Canton and Enderbury Islands ', ' Cuba ', ' Cape Verde ', ' Christmas Island ', ' Cyprus ', ' Czech Republic ', ' East Germany ', ' Germany ', ' Djibouti ', ' Denmark ', ' Dominica ', ' Dominican Republic ', ' Algeria ', ' Ecuador ', ' Estonia ', ' Egypt ', ' Western Sahara ', ' Eritrea ', ' Spain ', ' Ethiopia ', ' Finland ', ' Fiji ', ' Falkland Islands ', ' Micronesia ', ' Faroe Islands ', ' French Southern and Antarctic Territories ', ' France ', ' Metropolitan France ', ' Gabon ', ' United Kingdom ', ' Grenada ', ' Georgia ', ' French Guiana ', ' Guernsey ', ' Ghana ', ' Gibraltar ', ' Greenland ', ' Gambia ', ' Guinea ', ' Guadeloupe ', ' Equatorial Guinea ', ' Greece ', ' South Georgia and the South Sandwich Islands ', ' Guatemala ', ' Guam ', ' Guinea-Bissau ', ' Guyana ', ' Hong Kong SAR China ', ' Heard Island and McDonald Islands ', ' Honduras ', ' Croatia ', ' Haiti ', ' Hungary ', ' Indonesia ', ' Ireland ', ' Israel ', ' Isle of Man ', ' India ', ' British Indian Ocean Territory ', ' Iraq ', ' Iran ', ' Iceland ', ' Italy ', ' Jersey ', ' Jamaica ', ' Jordan ', ' Japan ', ' Johnston Island ', ' Kenya ', ' Kyrgyzstan ', ' Cambodia ', ' Kiribati ', ' Comoros ', ' Saint Kitts and Nevis ', ' North Korea ', ' South Korea ', ' Kuwait ', ' Cayman Islands ', ' Kazakhstan ', ' Laos ', ' Lebanon ', ' Saint Lucia ', ' Liechtenstein ', ' Sri Lanka ', ' Liberia ', ' Lesotho ', ' Lithuania ', ' Luxembourg ', ' Latvia ', ' Libya ', ' Morocco ', ' Monaco ', ' Moldova ', ' Montenegro ', ' Saint Martin ', ' Madagascar ', ' Marshall Islands ', ' Midway Islands ', ' Macedonia ', ' Mali ', ' Myanmar [Burma] ', ' Mongolia ', ' Macau SAR China ', ' Northern Mariana Islands ', ' Martinique ', ' Mauritania ', ' Montserrat ', ' Malta ', ' Mauritius ', ' Maldives ', ' Malawi ', ' Mexico ', ' Malaysia ', ' Mozambique ', ' Namibia ', ' New Caledonia ', ' Niger ', ' Norfolk Island ', ' Nigeria ', ' Nicaragua ', ' Netherlands ', ' Norway ', ' Nepal ', ' Dronning Maud Land ', ' Nauru ', ' Neutral Zone ', ' Niue ', ' New Zealand ', ' Oman ', ' Panama ', ' Pacific Islands Trust Territory ', ' Peru ', ' French Polynesia ', ' Papua New Guinea ', ' Philippines ', ' Pakistan ', ' Poland ', ' Saint Pierre and Miquelon ', ' Pitcairn Islands ', ' Puerto Rico ', ' Palestinian Territories ', ' Portugal ', ' U.S. Miscellaneous Pacific Islands ', ' Palau ', ' Paraguay ', ' Panama Canal Zone ', ' Qatar ', ' Réunion ', ' Romania ', ' Serbia ', ' Russia ', ' Rwanda ', ' Saudi Arabia ', ' Solomon Islands ', ' Seychelles ', ' Sudan ', ' Sweden ', ' Singapore ', ' Saint Helena ', ' Slovenia ', ' Svalbard and Jan Mayen ', ' Slovakia ', ' Sierra Leone ', ' San Marino ', ' Senegal ', ' Somalia ', ' Suriname ', ' São Tomé and Príncipe ', ' Union of Soviet Socialist Republics ', ' El Salvador ', ' Syria ', ' Swaziland ', ' Turks and Caicos Islands ', ' Chad ', ' French Southern Territories ', ' Togo ', ' Thailand ', ' Tajikistan ', ' Tokelau ', ' Timor-Leste ', ' Turkmenistan ', ' Tunisia ', ' Tonga ', ' Turkey ', ' Trinidad and Tobago ', ' Tuvalu ', ' Taiwan ', ' Tanzania ', ' Ukraine ', ' Uganda ', ' U.S. Minor Outlying Islands ', ' United States ', ' Uruguay ', ' Uzbekistan ', ' Vatican City ', ' Saint Vincent and the Grenadines ', ' North Vietnam ', ' Venezuela ', ' British Virgin Islands ', ' U.S. Virgin Islands ', ' Vietnam ', ' Vanuatu ', ' Wallis and Futuna ', ' Wake Island ', ' Samoa ', ' People s Democratic Republic of Yemen ', ' Yemen ', ' Mayotte ', ' South Africa ', ' Zambia ', ' Zimbabwe ', ' Unknown or Invalid Region ', ' Zimbabwe '];
           $scope.states = ['Alabama', 'Alaska', 'Arizona', 'Arkansas', 'California', 'Colorado', 'Connecticut', 'Delaware', 'Florida', 'Georgia', 'Hawaii', 'Idaho', 'Illinois', 'Indiana', 'Iowa', 'Kansas', 'Kentucky', 'Louisiana', 'Maine', 'Maryland', 'Massachusetts', 'Michigan', 'Minnesota', 'Mississippi', 'Missouri', 'Montana', 'Nebraska', 'Nevada', 'New Hampshire', 'New Jersey', 'New Mexico', 'New York', 'North Dakota', 'North Carolina', 'Ohio', 'Oklahoma', 'Oregon', 'Pennsylvania', 'Rhode Island', 'South Carolina', 'South Dakota', 'Tennessee', 'Texas', 'Utah', 'Vermont', 'Virginia', 'Washington', 'West Virginia', 'Wisconsin', 'Wyoming', ' Alberta ', ' British Columbia ', ' Manitoba ', ' New Brunswick ', ' Newfoundland and Labrador ', ' Nova Scotia ', ' Ontario ', ' Prince Edward Island ', ' Quebec ', ' Saskatchewan '];
           $scope.selected = undefined;
       },    
        templateUrl: '/App/Templates/form-elements-template/form-input-text-template.html',
        link: function (scope, element) {
            // textarea autosize function
            var updateTextAreaHeight = function () {
                var textareaScrollHeight = element.find('.form-control')[0].scrollHeight;
                var textAreaCurrentHeight = element.find('.form-control').height();
                if (textareaScrollHeight > textAreaCurrentHeight  ){
                    element.find('.form-control').css('height', textareaScrollHeight + 2 + 'px');};
            };
            element.on('keyup', updateTextAreaHeight);     
            element.on('focusout', function() {
                updateTextAreaHeight();              
            });   
        }
       };   
};


/*Sample template html PATH : /App/Templates/form-elements-template/form-input-text-template.html

<div ng-switch on="sourceData.Input" class="form-group">  
    <div class="col-md-6">
            <div class="row clearfix">
                <div class="col-md-12 column">
                    <!--LABEL-->
                    <label class="text-primary">{{ sourceData.Label  }} </label>
                </div>
            </div>
            <div class="row clearfix">
                <div class="col-md-12 column">
                    <!--QUESTION-->
                    <label class="text-default">{{ sourceData.Question  }} </label>
                </div>
            </div>
    </div>     
    <!---SWITCH START ON QUESTION INPUT -->
    <div class="col-md-6">

        <!--TEXT supported text input types : text, password, datetime, datetime-local, date, month, time, week, number, email, url, search, tel, and color.-->
        <div ng-switch-when="text">         
            <input type="{{sourceData.InputType}}"
                   class="form-control"
                   name="{{ sourceData.Question }} "
                   placeholder="{{sourceData.Placeholder}}"
                   value="{{ sourceData.Value }}"
                   tooltip="On the Right!"
                   tooltip-placement="right" />                
        </div> 
        
        <!--ADDRESS-->
        <div ng-switch-when="address">
            <input type="text"
                   ng-model="asyncSelected"
                   placeholder="Locations loaded via $http"
                   typeahead="address for address in getLocation($viewValue)"
                   typeahead-loading="loadingLocations"
                   class="form-control"
                   tooltip="{{sourceData.tooltip}}"
                   tooltip-trigger="focus"
                   tooltip-placement="{{sourceData.TooltipPlacement}}" />
                  <i ng-show="loadingLocations" class="glyphicon glyphicon-refresh"></i>  
        </div>

        <!--STATE-->
        <div ng-switch-when="state">               
               <!-----Html      <script type="text/ng-template" id="customTemplate.html">
                        <a>
                            <img ng-src="http://upload.wikimedia.org/wikipedia/commons/thumb/{{match.model.flag}}" width="16">
                            <span bind-html-unsafe="match.label | typeaheadHighlight:query"></span>
                        </a>
                    </script> Template with the image source-->
            <input type="text" 
                   ng-model="selected" 
                   placeholder="state"  
                   typeahead="state for state in states | filter:$viewValue | limitTo:8" 
                   class="form-control">
        </div>

        <!--COUNTRY-->
        <div ng-switch-when="country">
            <input type="text" 
                   ng-model="Country" 
                   placeholder="country" 
                   typeahead="contry for contry in  contries | filter:$viewValue | limitTo:8" 
                   class="form-control">                      
        </div>
            <!--TEXT AREA-->
            <div ng-switch-when="textarea">
                <textarea class="form-control" 
                          name="{{ sourceData.Question }} " 
                          placeholder="{{ sourceData.Placeholder }}" 
                          value="{{ sourceData.Value }}"></textarea>
            </div>

            <!--SELECT LIST-->
            <div ng-switch-when="select">
                <select name="{{ sourceData.Question}} " class="form-control">
                    <option ng-repeat=" opt in sourceData.option" value="{{opt}}">{{opt}}</option>
                </select>
            </div>

            <!--RADIO LIST-->
            <div ng-switch-when="radio">
                <div ng-repeat=" val in sourceData.Value" class="radio-inline">
                    <label>
                        <input type="radio"
                               name="{{ sourceData.Question }} " 
                               value="{{val}}" />
                        {{val}}
                    </label>
                </div>
            </div>

            <!--CHEKBOX LIST-->
            <div ng-switch-when="checkbox">
                <div ng-repeat=" val in sourceData.Value" class="checkbox-inline">
                    <label>
                        <input type="checkbox" 
                               name="{{ sourceData.Question }} " 
                               value="{{val}}" />
                        {{val}}
                    </label>
                </div>
            </div>

            <!--DEFAULT ERROR  CONTROL WITH NO TYPE-->
            <div ng-switch-default>
                <label class="label label-danger form-control">The question <span class="label label-info"> "  
                    {{sourceData.Question }}" </span><br/>  has not input type such as (input type: text, texarea..etc)</label>
            </div>

        </div>
</div>*/
